<template>
<el-form ref="form" :model="form" label-width="80px">
  <el-form-item label="页眉内容">
    <el-input v-model="form.name"></el-input>
  </el-form-item>
   <el-form-item label="页脚内容">
    <el-input v-model="form.desc"></el-input>
  </el-form-item>
  <el-form-item label="页眉类型">
    <el-select v-model="form.region" placeholder="请选择文档类型">
      <el-option label="内部公开" value="public"></el-option>
      <el-option label="秘密" value="confidential"></el-option>
      <el-option label="机密" value="security"></el-option>
    </el-select>
  </el-form-item>
  <el-form-item label="页眉页脚">
    <el-checkbox-group v-model="form.type">
      <el-checkbox label="页眉" name="type"></el-checkbox>
      <el-checkbox label="页脚" name="type"></el-checkbox>
      <el-checkbox label="Logo" name="type"></el-checkbox>
    </el-checkbox-group>
    <div class="hdrlogo">
      <img src="@/assets/logo.png"/>
    </div>
  </el-form-item>
  <el-form-item style="margin-bottom:0">
    <el-button type="primary" size="small" @click="onSubmit">保存设置</el-button>
    <el-button size="small">重设</el-button>
  </el-form-item>
</el-form>
</template>
<script>
  export default {
    data() {
      return {
        form: {
          name: '',
          region: '',
          date1: '',
          date2: '',
          delivery: false,
          type: [],
          resource: '',
          desc: ''
        }
      }
    },
    methods: {
      onSubmit() {
        console.log('submit!');
      }
    }
  }
</script>

<style scoped>
.hdrlogo {
  position: absolute;
  right: 60px;
  bottom: -10px;
  border: 1px solid lightgray;
}

.hdrlogo img {
  width: 100px;
}

</style>